<template>
    <div>
        <table class="table">
            <tbody class="table-danger">
                <tr>
                    <td>房号</td>
                    <td>
                        <input type="text" v-model="data.hname" >
                    </td>
                </tr>
                <tr>
                    <td>地址</td>
                    <td>
                        <input type="text" v-model="data.address">
                    </td>
                </tr>
                <tr>
                    <td>类型</td>
                    <td>
                        <select v-model="data.tid">
                            <option :value="0">==请选择==</option>
                            <option v-for="s in showdata" :value="s.tid">{{s.tname}}</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td>照片</td>
                    <td>
                        <input type="file" @change="up" >
                        <img :src="'https://localhost:7279'+data.himg" style="width: 80px;height: 80px;">
                    </td>
                </tr>
                <tr>
                    <td>状态</td>
                    <td>
                        <input type="radio" name="se" :value="true" v-model="data.isStatus">可预订
                        <input type="radio" name="se" :value="false" v-model="data.isStatus">已入住
                    </td>
                </tr>
                <tr>
                    <td></td>
                    <td>
                        <input type="button" value="录入" @click="add">
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</template>

<script setup lang="ts">

import axios from 'axios';
import { ref,onMounted } from 'vue';
import { useRouter } from 'vue-router';

onMounted(()=>{
    show();
})

const showdata=ref([{
     "tid": 0,
    "tname": ""
}])
const show=()=>{
    axios.get("https://localhost:7279/api/Hotel/IGetType").then(res=>{
        showdata.value=res.data;
    })
}


const up=(e:any)=>{
    var f=e.target.files[0];
    var fd=new FormData();
    fd.append("files",f);
    axios.post("https://localhost:7279/api/UpLoad/Up",fd).then(res=>{
        data.value.himg=res.data;
    })
}


const data=ref({
    "hmid": 0,
  "hname": "",
  "address": "",
  "tid": 0,
  "himg": "",
  "isStatus": true
})
const router=useRouter();
const add=()=>{
    if(confirm("确定录入信息")){
        axios.post("https://localhost:7279/api/Hotel/AddHotel",data.value).then(res=>{
        if(res.data==-1){
            alert("房号不可重复")
            return;
        }
        if(res.data>0){
            alert("录入成功")
            router.push({path:'/'})
        }else{
            alert("录入失败")
        }
    })
    }
    
}

</script>

<style scoped>

</style>